<template>

	<view class="guwen-item" hover-class="media-item-hover" @click="click">
		
		<view class="info">
			<view class="header">
				<image :src="options.face"></image>
			</view>
			<view class="detail">
				<view class="name">{{options.name}}</view>
				<view class="text">微信：{{options.wechat}}</view>
				<view class="text">公司：{{options.company}}</view>
				<view class="text">楼盘：{{options.house}}</view>
				<view class="text">佣金：<text class="money">{{options.wechat}}</text></view>
				<view class="button"><button>拨打电话</button><button>楼盘讲解</button></view>
			</view>
		</view>
			
		<view class="other">
			<view class="text"><text class="number">{{options.lookNum}}</text>浏览量</view>
			<view class="text"><text class="number">{{options.activeNum}}</text>活跃度</view>
			<view class="text"><text class="number">{{options.likeNum}}</text>点赞数</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		props: {
			options: {
				type: Object,
				default: function(e) {
					return {}
				}
			}
		},
		methods: {
			click() {
				this.$emit('click');
			},
			close(e) {
				this.$emit('close');
			}
		}
	}
</script>
<style lang="scss">
	.guwen-item{
		background-color:#FDDD9B;
		border-radius: 10px;
		.info{
			flex-direction:row;
			display: flex;
			.header{
				padding: 30upx;;
				image{
					width: 20vw;
					height: 20vw;
					border:white 1px solid;
					border-radius: 100%;
				}
			}
			.detail{
				width:100%;
				.name{
					font-size:45upx;
					font-weight:700;
					padding: 10px 0;
				}
				.text{
					font-size: 30upx;
					color:#333333;
					padding: 4px 0;
					.money
					{
						color:red;
					}
				}
				.button{
					padding: 10px 0;;
					display:flex;
					flex-direction: row;
					button{
						width:40%;
						height:8vw;
						line-height: 8vw;
						font-size: 30upx;;
						border-radius: 30px;
						color:#DD524D;
						background-color:#F0AD4E;
					}
					
				}
				
			}
		}
		.other{
			font-size: 30upx;
			color:#333333;
			display: flex;
			flex-direction:row;
			border-top: white 2px solid;
			width:96%;
			margin:0 2%;
			
			.text{
				display: table-cell;
				vertical-align:middle;
			    flex:1;		
				text-align: center;
				padding:10px 0;
				.number{
					font-weight: 600;
					color:black;
					
				}
			}
		}
		
	}
</style>
